<template>
    <div class="form">
        <section class="body">
            <p class="hedd-text">患者个人保障状况</p>
            <div class="smallTitle">患者是否按时缴纳医保？</div>
            <van-tabs type="card" v-model="car">
                <van-tab title="有" name="yes">
                </van-tab>
                <van-tab title="无" name="no"></van-tab>
            </van-tabs>
            <div class="smallTitle">患者是否购买重疾商业保险？</div>
            <van-tabs type="card" v-model="car">
                <van-tab title="有" name="yes">
                </van-tab>
                <van-tab title="无" name="no"></van-tab>
            </van-tabs>
            <div class="smallTitle">患者是否享有低保？(选填)</div>
            <van-tabs type="card" v-model="car">
                <van-tab title="有" name="yes">
                </van-tab>
                <van-tab title="无" name="no"></van-tab>
            </van-tabs>
            <div class="smallTitle">患者是否享有政府救助？(选填)</div>
            <van-tabs type="card" v-model="car">
                <van-tab title="有" name="yes">
                </van-tab>
                <van-tab title="无" name="no"></van-tab>
            </van-tabs>
            <p class="hedd-text">患者家庭经济状况(选填)</p>
            <van-field v-model="money"  placeholder="患者家庭年收入(万元)" maxlength="10" />
            <br/>
            <van-field v-model="money"  placeholder="患者家庭金融资产总价值(万元)" maxlength="10" />
            <p class="describe">*金融资产包括个人存款、股票等</p>
        </section>
        <footer class="footer">
            <van-button
                type="primary"
                round
                color="linear-gradient(to right, #ff3c3c, #ff5e10)"
                size="large"
                @click="submit"
            >下一步</van-button>
        </footer>
    </div>
</template>

<script>
import { Field, Button, Toast, Tab, Tabs, Stepper } from "vant";
export default {
    components: {
        [Field.name]: Field,
        [Button.name]: Button,
        [Tab.name]: Tab,
        [Tabs.name]: Tabs,
        [Stepper.name]: Stepper
    },
    data() {
        return {
            car: "no",
            num01:'',
            money01:'',
            type:"none",
            num02:"",
            money02:'',
            num03:"",
            money03:'',
        };
    },
    methods: {
        submit(){
            
        }
    }
};
</script>

<style scoped>
.smallTitle {
    display: flex;
    justify-content: space-between;
    margin: 8px 0 14px;
    height: 24px;
    align-items: center;
    font-size: 14px;
    font-family: PingFangSC-Semibold;
    font-weight: bold;
    color: rgba(0, 0, 0, 0.8);
    line-height: 20px;
}
.stepper {
    font-weight: 400;
}
.body{
    padding-bottom: 80px;
}
.describe {
    font-size: 14px;
    font-weight: 400;
    color: rgba(0, 0, 0, 0.32);
    line-height: 20px;
    margin-top: 16px;
}
</style>